import Vue from "vue";
import Vuex from "vuex";
import router from "../router";
// 请求用户菜单的api
import * as permissionApi from "../api/permission"
// 请求学员信息的api 
 import  * as stuApi from "../api/studentManage"
//  请求订单信息的api
import * as shoppingApi from "../api/shopping"
//所有的路由配置
import allRouters from "../router/allRouters"
//工具函数 计算用户的路由
import recursionRouters from "../utils/recursionRouters"
//引入需要动态添加的路由
import dynamicRouters from "../router/dynamicRouters"
// 从本地取用户信息，防止刷新页面的时候用户昵称的丢失
// 因为state中的userInfo存的是一个JSON字符串所以当本地没有
// 用户信息的时候传的是字符形式的对象
let userInfo=localStorage.getItem("bd-userInfo")||"{}"
let currentChargeProduct=localStorage.getItem("bd-currentChargeProduct")||"[]"
Vue.use(Vuex);

export default new Vuex.Store({
  state: {   
    userInfo: JSON.parse(userInfo),// 存储用户信息
    sideMenu:[], //用户菜单
    breadCrumb:[],//面包屑数据
    dialogVisible:false,//控制dialog显示和隐藏
    dialogTitle:"添加学员信息",//控制dialog标题
    stuData:[],//学员列表数据
    loading: true, //表格加载动画
    currentRow:{},// 编辑的时候,dialog回显的表格数据
    stuTotal:0,//服务器返回的学员列表总条数
    stuPageSize:10,//学员列表每页显示的数量
    orderData:[],//订单数据
    currentChargeProduct:JSON.parse(currentChargeProduct),//当前充值的产品
    order_id:"",//订单id
    stuDetailData:"",//学员数据
  },
  mutations: {
    // 表格显示loading动画
    SHOW_LOADING(state){
      state.loading=true
    },
    //表格隐藏loading动画
    HIDE_LOADING(){//这个方法没有用到在设置学员表格的时候已经关闭loading动画
      state.loading=false
    },
    // 设置用户信息
    SET_USERINFO(state, payload) {
      state.userInfo = payload;
    },
    
    //设置用户菜单
    SET_SIDEMENU(state,payload){
      //还需要动态的将路由添加到项目中

      // 所有的动态路由都要成为 /路径这个路由配置的children 
      let target=dynamicRouters.find(route=>route.path==="/")
        //将用户路由添加给/ 配置的children
        target.children=[...payload,...target.children]
        // 动态的将dynamicRouters添加到路由的配置当中
        //需要先引入全局的路由
        // 核心方法是 addRouters(Array<routerConfig>)
        //  router.addRoutes(dynamicRouters)
        // 新版方法叫addRouter({}) 接收的是一个对象  需要将一个个对象放进去
        dynamicRouters.forEach(route=>{
          router.addRoute(route)
        })
        // 要排除不需要展示在菜单中的页面 
        let excludeRoutes=["pre_order","payment"]
        target.children=target.children.filter(item=>!excludeRoutes.includes(item.path))
        //将侧边栏数据赋值 侧边栏的名称是路由meta中name的数据
       state.sideMenu=target.children;
    },

    //设置面包屑
    SET_BREADCRUMB(state,payload){
      state.breadCrumb=payload;
    },

    //控制dialog显示和隐藏
    SHOW_DIALOG(state){
      state.dialogVisible=true;
    },
    HIDE_DIALOG(state){
      state.dialogVisible=false;
    },
    //修改dialog标题
    CHANGE_DIALOG_TITLE(state,payload){
      state.dialogTitle=payload
    }, 

    // 设置学员项目管理表格中的数据
    SET_STU_DATA(state,payload){
      state.stuData=payload.data;
      state.loading=false;//关闭加载动画
      state.stuTotal=payload.total;//总条数
    },

    // 修改dialog回显数据
    SET_CURRENT_ROW(state,payload){
      state.currentRow={...payload};//浅拷贝防止后面对象出问题
    },
    // 设置订单数据
    SET_ORDER_DATA(state,payload){
      state.orderData=payload;
    },
    // 设置当前充值的产品
    SET_CURRENT_CHARGE_PRODUCT(state,payload){
      state.currentChargeProduct=[payload]
      localStorage.setItem("bd-currentChargeProduct",JSON.stringify([payload]))
    },
    // 设置订单id
    SET_ORDER_ID(state,payload){
      state.order_id=payload
    },
    // 设置学员数据
    SET_STUDATA(state,payload){
      state.stuDetailData=payload
    },
  },
  actions: {
    //需要异步获取用户菜单
       async FETCH_MENULIST({commit}){
       let res=await permissionApi.getMenuListApi()
      //  console.log(res);
      // 计算用户路由
      let userRouter=recursionRouters(allRouters,res.data.menuList)
      commit("SET_SIDEMENU",userRouter)
    },
   //获取学员列表信息
     GET_STULIST({commit},payload={}){
      // console.log(commit);
      commit("SHOW_LOADING")//打开加载动画
      let { page=1,count=10,classes=""}=payload;//结构传递的参数
      stuApi.getStuListApi(page,count,classes).then(res=>{
      //  console.log(res);
       commit("SET_STU_DATA",res.data)
     })
   } ,
  //  获取订单数据
   GET_ORDER_DATA({commit},payload){
      let order_id=payload||"";
      shoppingApi.getOrderApi(order_id)
      .then(res=>{
        // console.log(res.data);
        if(res.data.data){
          commit("SET_ORDER_DATA",res.data.data)
        }else{
          this.$message.error('订单获取失败')
        }
      })
   },
  },
  modules: {},
});
